




/*首先让body和html都为100%宽高，后边用百分比才好用！！*/
body,html{width: 100%;height: 100%}

/*设置整个内容的容器跟屏幕大小一样的宽高*/
#content{
  width: 100%;height: 100%;
  background: url("/statics/imgs/bg.jpg");
  background-position:0;
  background-size: 100%;
}

/*大背景图片始终保证跟屏幕一样宽*/
#content_bg{width: 100%;background-position: 0}

/*欢迎文字*/
#content_hy{
  width:40%;
  position: absolute;top:6%;left: 30%
}


/*个人中心栏的容器*/
#content_ss{
  position: absolute;top:15%;
  width: 100%;height: 10%;

}
/*个人中心栏的背景*/
#content_ss_bg{
  width: 96%;height:100%;margin-left: 2%;
  border-radius:5px;
  background-color: #ffffff; opacity: 0.7;
}
/*个人中心栏的向右箭头图标*/
#content_ss_tb{
  height: 40%;
  position: absolute;top:27%;right: 7%;
}

/*个人中心栏的右侧文字-个人中心*/
#content_ss_text{
  font-size: 16px;
  position: absolute;top:34%;right: 16%;
  color: #979797;
}

/*个人中心栏的左侧头像*/
#content_ss_tx{
  height: 70%;
  position: absolute;top:15%;left:5%;

}



/*底部的四个大块内容容器*/
#content_bottom{
  width: 100%;
  height: 70%;
  /*background-color: red;*/
  position: absolute;
  top:28%;
}

/*四个单个模块*/
.content_bottom_div{
  /*width=(100%-(左右的间隙是2%*2+中间的间隙2%))/2=47%*/
  width: 47%;
  /*height=(100%-(中间的间隙2%))/2=47.5%*/
  height: 49.5%;
  float: left;
  margin-left: 2%;
  margin-bottom: 2%;
  position: relative;
}
/*四个背景*/
.content_bottom_div_bg{
  width: 100%;height: 100%;
  border-radius:10px;
  background-color: #ffffff;
  opacity: 0.7;
}
/*四个图标*/
.content_bottom_div_img{
  position: absolute;top:0px;left: 0px;
  width: 50%;top: 35%;left: 25%;
}
/*四个模块的标题*/
.content_bottom_div_tetle{
  position: absolute;top:7%;left: 10%;
  font-size: 16px;
  color: #474747;
  font-family: "Microsoft Yahei","Heiti SC","Droid Sans",Arial;

}
/*四个模块的英文*/
.content_bottom_div_cn{
  position: absolute;top:18%;left: 10%;
  font-size: 12px;
  color: #797979;
  font-family: "Microsoft Yahei","Heiti SC","Droid Sans",Arial;

}